<!--门票列表-->
<template>
  <view class="tickets-list-page">    
      <scrollHeaderFixed
        :scrollTop="scrollTop"        
				@clickLeft="goBack"
      ><!-- :seizeHeight="180" -->
      <view slot="navBar">
        <basic-nav-bar 
          backgroundColor="transparent"
          :statusBar="true"
          :border="false" 
          :fixed="true"
          left-icon="arrowleft" 
          title="门票" 
          @clickLeft="goBack" />        
      </view>
          <view slot="search">
            <!-- 搜索入口 -->
            <search-entrns 
              placeholder="搜索门票" 
              showCity
              :name="params.name"
              :keyword="params.keyword"
              @click:clear="handleClearKeyword"
              @click:city="$listSearch_toSelectCity({productType: 3})" 
              @click:search="$listSearch_toSearch({regionId: params.regionId, name: params.name, keyword: params.keyword, productType: 3})" />
          </view>
          <!-- 排序、筛选 -->
          <sortBar @submit="sortBarSubmit" :params="params"/>
      </scrollHeaderFixed>
      
      <view class="tickets-list-page--content">  
        <basic-skeleton
          :loading="loading"
          :list="skeleton"
        >
        
        <!-- 列表 -->  
        <list :params="params"></list>
      </basic-skeleton>

      <!-- 安全区 -->
			<basic-safe-area />
    </view>
  </view>
</template>
<script>
import sdk from 'sdk'
import { searchTickets } from 'api'
import {decodeQueryObject} from 'utils/helper/query'
import searchEntrns from '@/components/business/search-entrns'
import scrollHeaderFixed from '@/components/business/scroll-header-fixed'
import sortBar from './components/sortBar'
import list from './components/list'
import listSearch from '@/mixins/list-search'
import city from '@/mixins/city'
import skeleton from './skeleton'
import {DEFAULT_CITY} from '@/model/enum'

export default {
  name: 'tickets',

  mixins: [listSearch,city],
  
  components: {
    sortBar,
    list,
    searchEntrns,
    scrollHeaderFixed
  },

  data(){
    return {
      tabsList: [
        { label: '全部', value: 1 },
        { label: '自然风光', value: 2 },
        { label: '游乐场', value: 3 },
        { label: '现代建筑', value: 4 },
      ],
      params: {},
      options: {},
      tickets: [],
      scrollTop:0,
      loading: false,
      skeleton: skeleton // 骨架图配置
    }
  },

  onLoad(query) {
    this.initParams(query)
  },


  onPageScroll(e) {
    this.scrollTop = e.scrollTop
  },
  
  methods: {
    initParams(query) {
        this.params = { // 列表筛选条件
          ...DEFAULT_CITY,
          isCurrentCity: false,
          keyword: '',
          pageNum: 1,
          pageSize: 10,
          "lat": null,
          "lon": null,
          "bookingDateType": 0, // 预订时限: 0全部，1可订今日，2可订明日
          "maximumPrice": null,
          "minimumPrice": null,
          "sortType": 0, // 0综合排序，2价格低到高，3价格高到低
          "starLevel": null // 景区级别
        }
        decodeQueryObject(query)
        // console.log('初始化门票参数-query：', query)
        let {regionId, keyword, name} = query   
        this.options = query     
        // TODO 选中城市
        // 填入关键词
        regionId && (this.params.regionId = regionId)
        keyword && (this.params.keyword = keyword)
        name && (this.params.name = name)
        let cacheCity = this.$city_getCacheCity()
        if (cacheCity) {
					const { lat, lon } = cacheCity
          const isCurrentCity = Number(this.params.regionId)===Number(cacheCity.regionId) 
          this.params = { 
            ...this.params, 
            lat, 
            lon, 
            isCurrentCity
          }
        }
        // console.log('初始化门票参数-params：', this.params)
    },
    resetParams() {
      this.params = { 
        ...this.params, 
        pageNum: 1,
        pageSize: 10,
        "bookingDateType": 0, // 预订时限: 0全部，1可订今日，2可订明日
        "maximumPrice": null,
        "minimumPrice": null,
        "sortType": 0, // 0综合排序，2价格低到高，3价格高到低
        "starLevel": null // 景区级别
      }
    },
    handleClearKeyword() {
        this.params =　{ ...this.params, keyword:'' }
    },
    toSearch() {
        sdk.navigateTo({
          url:'/pages/search/index'
        })
    },
    goBack() {
        sdk.navigateBack()      
    },
    sortBarSubmit(sortParams) {
        this.params = { ...this.params, pageNum: 1, pageSize: 10, ...sortParams }
    },
    changeCategoryType(cate) {
        this.params.categoryType = cate.label
    }
  }
}
</script>
<style lang="less">
.tickets-list-page{
  .tickets-list-page--content{
     padding: 10rpx @page_horizonal_margin 0;
  }
}
</style>

